uniApp：基本组件 |
您所在的位置：网站首页 › uniapp 长按应用图标 › uniApp：基本组件 |
uniApp：基本组件
|
官方文档组件：https://uniapp.dcloud.io/component/README text 文本组件用于包裹文本内容。 注意事项： 组件内只支持嵌套 ，不支持其它组件或自定义组件。 在 app-nvue 下，只有 才能包裹文本内容。 decode 可以解析的有 ; 、 ; 、 、 ; 、 ' 、 。 除了文本节点以外的其他节点都无法长按选中。 如果使用 组件编译时会被转换为 。 | text 属性名 | 类型 | 默认值 | 说明 | 平台差异说明 | | — | — | — | — | — | | selectable | Boolean | false | 文本是否可选 | App、H5、快手小程序 | | user-select | Boolean | false | 文本是否可选 | 微信小程序 | | space | String | | 显示连续空格 | App、H5、微信小程序 | | decode | Boolean | false | 是否解码 | App、H5、微信小程序 | space 值说明 | 值 | 说明 | | — | — | | ensp | 中文字符空格一半大小 | | emsp | 中文字符空格大小 | | nbsp | 根据字体设置的空格大小 | 可选中的文本 视图容器 view 视图容器组件视图容器组件，类似于传统 html 中的 div，用于包裹各种元素内容。 如果使用 ，编译时会被转为 。 view 属性名类型默认值说明hover-classStringnone指定按下去的样式类。当 hover-class="none"时，没有点击态效果hover-stop-propagationBooleanfalse指定是否阻止本节点的祖先节点出现点击态hover-start-timeNumber50按住后多久出现点击态，单位毫秒hover-stay-timeNumber400手指松开后点击态保留时间，单位毫秒 小盒子 .box { width: 200px; height: 200px; background-color: #F00; }, .box1, { background-color: #00F; } .con { width: 100px; height: 100px; background-color: #0ff; }, .con1 { background-color: #0f0; } 表单组件 button 按钮组件注意事项： button-hover 默认为 {background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;} 。open-type="launchApp"时需要调起的APP接入微信OpenSDK 详见 属性名类型默认值说明sizeStringdefault按钮的大小typeStringdefault按钮的样式类型plainBooleanfalse按钮是否镂空，背景色透明disabledBooleanfalse是否禁用loadingBooleanfalse名称前是否带 loading 图标size 有效值 | 值 | 说明 | | — | — | | default | 默认大小 | | mini | 小尺寸 | type 有效值 | 值 | 说明 | | — | — | | primary | 多端显示为蓝色。如想在多端统一颜色，请改用 default，然后自行写样式 | | default | 白色 | | warn | 红色 | form-type 有效值 | 值 | 说明 | | — | — | | submit | 提交表单 | | reset | 重置表单 | open-type 有效值 | 值 | 说明 | | — | — | | feedback | 打开“意见反馈”页面，用户可提交反馈内容并上传日志 | | share | 触发用户转发 | | getPhoneNumber | 获取用户手机号，可以从@getphonenumber回调中获取到用户信息，App平台另见一键登陆 | 默认按钮 mini按钮 多端显示为蓝色按钮 镂空按钮 禁用按钮 等待按钮
mode 有效值 mode 有 14 种模式，其中 5 种是缩放模式，9 种是裁剪模式。 模式值说明缩放scaleToFill不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素缩放aspectFit保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。缩放aspectFill保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取。缩放widthFix宽度不变，高度自动变化，保持原图宽高比不变缩放heightFix高度不变，宽度自动变化，保持原图宽高比不变 App 和 H5 平台 HBuilderX 2.9.3+ 支持、微信小程序需要基础库 2.10.3裁剪top/bottom/center/ left/righttop 不缩放图片，只显示图片的顶部区域 botton 不缩放图片，只显示图片的底部区域 center 不缩放图片，只显示图片的中间区域 left 不缩放图片，只显示图片的左边区域 right 不缩放图片，只显示图片的右边区域裁剪top left / top righttop left 不缩放图片，只显示图片的左上边区域 top right 不缩放图片，只显示图片的右上边区域裁剪bottom left / bottom rightbottom left 不缩放图片，只显示图片的左下边区域 bottom right 不缩放图片，只显示图片的右下边区域 uni-ui 组件库uni-ui 是 DCloud 提供的一个跨端 ui 库，它是基于 vue 组件的、flex 布局的、无 dom 的跨全端ui框架。详情 |
【本文地址】
今日新闻 |
推荐新闻 |